<template>
  <div class="page-field">
    <div class="page-part form-body">
      <mt-radio
        class="page-part" align="right" title="选择模式" v-model="taskTrade.taskModel" :options="taskModelOptions"
      />

      <mt-radio
        class="page-part" align="right" title="交易模式" v-model="taskTrade.tradeModel" :options="tradeModelOptions"
      />

      <mt-radio
        class="page-part" align="right" title="招标形式" v-model="taskTrade.tenderModel" :options="tenderModelOptions"
        v-show="taskTrade.tradeModel === 2"
      />

    </div>

    <div class="page-part form-body" v-show="taskTrade.tradeModel === 2">
      <mt-field label="招标人数" placeholder="招标人数" type="number" v-model="taskTrade.peopleNum"></mt-field>
      <mt-field label="预算金额" placeholder="预算金额" type="number" v-model="taskTrade.fareTask"></mt-field>
    </div>

    <div class="page-part form-body">
      <mt-radio
        class="page-part" align="right" title="实名要求" v-model="taskTrade.realTask" :options="realTaskOptions"
      />

      <mt-radio
        class="page-part" align="right" title="任务类型" v-model="taskTrade.typeTask" :options="typeTaskOptions"
      />

      <mt-radio
        class="page-part" align="right" title="任务要求" v-model="taskTrade.requireTask" :options="requireTaskOptions"
      />

      <mt-radio
        class="page-part" align="right" title="任务目标" v-model="taskTrade.aimTask" :options="aimTaskOptions"
      />

    </div>

    <div class="page-part form-submit">
      <mt-button type="default" v-on:click="back">上一步</mt-button>
      <mt-button type="primary" v-on:click="next">提交</mt-button>
    </div>

  </div>

</template>

<script>
export default {
  props: ['taskTrade'],
  data() {
    return {};
  },
  methods: {
    next() {
      this.$emit('checkout', 'publish');
      // this.$emit('checkout', 'f-task-pay');
    },
    back() {
      this.$emit('checkout', 'f-task-base');
    },
  },
  created() {
    this.taskModelOptions = [
      {
        label: '自动',
        value: 2,
      }, {
        label: '人工',
        value: 1,
      },
    ];
    this.tradeModelOptions = [
      {
        label: '招标',
        value: 2,
      }, {
        label: '悬赏',
        value: 1,
      },
    ];
    this.tenderModelOptions = [
      {
        label: '荷氏',
        value: 1,
      }, {
        label: '英式',
        value: 2,
      },
    ];
    this.realTaskOptions = [
      {
        label: '是',
        value: 1,
      }, {
        label: '否',
        value: 2,
      },
    ];
    this.typeTaskOptions = [
      {
        label: '单人任务',
        value: 1,
      }, {
        label: '多人任务',
        value: 2,
      },
    ];
    this.requireTaskOptions = [
      {
        label: '全部完成',
        value: 1,
      }, {
        label: '部分完成',
        value: 2,
      },
    ];
    this.aimTaskOptions = [
      {
        label: '社会最大',
        value: 1,
      }, {
        label: '发布者最大',
        value: 2,
      }, {
        label: '带预算最大',
        value: 3,
      },
    ];
  },
};
</script>

<style lang="css">

.form-body {
  text-align: left;
  margin-left: 10px;
  color: #42b983;
}

.form-submit {
  margin-top: 20px;
}

.mint-radiolist-title {
  font-size: 18px;
}

.mint-cell-text {
  margin-left: 16px;
}

</style>
